import 'package:flutter/material.dart';

/**
 * 使用自定义的顶部导航栏  必须继承自动态的组件StatefulWidget,实现
 * 这种方式可以在 tabController中实现监听一些事件，处理业务逻辑
 */

// class ChannelPage extends StatefulWidget {
//   const ChannelPage({Key key}) : super(key: key);

//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         title:Text("频道")
//       ),
//       body: Text("频道页面"),
//     );
//   }
// }

class FindPage extends StatefulWidget {
  FindPage({Key key}) : super(key: key);

  @override
  _FindPageState createState() => _FindPageState();
}

class _FindPageState extends State<FindPage> with SingleTickerProviderStateMixin{
  
  TabController _tabController;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _tabController = new TabController(
      length: 2,
      vsync: this,
    );

    //实现对_tabController 的监听  可以实现很多自定义的功能
    _tabController.addListener(() { 
      //监听tab改变 改变时打印出对应的索引值
      print(_tabController.index);

    });
  }
  
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:Row(
          children: [
            Text("发现",style: TextStyle(color: Colors.white),),
            Expanded(
              child: Container(
                margin: EdgeInsets.only(left: 8.0),
                padding: EdgeInsets.all(8.0),
                alignment: Alignment.centerLeft,
                width: 180.0,
                height: 35.0,
                child: Icon(Icons.search, color: Colors.white),
                decoration: BoxDecoration(
                    color: Colors.black26, //使用了decorationn 要把颜色写在里面
                    borderRadius: BorderRadius.all(Radius.circular(20))),
              ),
            ),
            IconButton(
                  icon: Icon(
                    Icons.access_alarm,
                    size: 28.0,
                    color: Colors.white,
                  ),
                  onPressed: () {
                    print('点击游戏');
                  },
                ),
                GestureDetector(   
                  onTap:(){
                    // Navigator.pushNamed(context, '/person');
                    //使用自定义的渐入动画
                    // Navigator.of(context).push(CustomRoute(PersonPage()));

                  },
                  child: ClipOval(
                    child: Image.network(
                      'https://i0.hdslb.com/bfs/face/member/noface.jpg@140w_140h_1c.webp',
                      width: 30.0,
                      height: 30.0,
                    ),
                  ),
                ),
          ],
          ),
        bottom: TabBar(
          controller: this._tabController, //也可直接写_tabController
          isScrollable:true ,
          tabs: <Widget>[
            Tab(text:"频道"),
            Tab(text:"分区"),
          ],
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: <Widget>[
          Center(child:Text("频道")),
          Center(child:Text("分区")),
        ],
      ),
    );
  }
}